<script src="__PUBLIC__/js/jquery/validate.js"></script>

<script>
    jQuery.validator.addMethod("isMobile", function(value, element) {  
        var length = value.length;        
        var mobile=/^1[3,5,8]\d{9}$/;
        if(value.length >0){
            return (mobile.exec(value))? true:false;  
        }else{
            return true;
        }
    }, "请正确填写您的手机号码"); 
    $("#form").validate({
        errorPlacement: function(error, element){
            var error_td = element.parent('td');
            error_td.next("td").find('label.error').hide();
            error_td.next("td").append(error);
        },
        submitHandler:function(form){
            saveAddr('{$id}');
        },
        rules : {
            truename : {
                required : true,
                minlength: 2,
                maxlength: 8
            },
            addr : {
                required : true,
                minlength: 4,
                maxlength: 35
            },
            phone : {
                required : true,
                isMobile  : true
            },
            phone2 : {
                isMobile  : true
            }
        },
        messages : {
            truename : {
                required : '姓名不能为空',
                minlength:  '姓名必须在2-8个字符之间',
                maxlength : '姓名必须在2-8个字符之间'
            },
            addr : {
                required : '地址不能为空',
                minlength:  '地址必须在4-50个字符之间',
                maxlength : '地址必须在4-50个字符之间'
            },
            phone : {
                required: "手机号码不能为空",
                isMobile: "手机号码格式不对"
            },
            phone2 : {
                isMobile: "手机号码格式不对"
            }
        }
    });
    function saveAddr(id){
        if($('#tbDeliveryInfo').children("tr").length >4  && id == ''){
            showTip('系统提示',"最多保存五个收货地址！",'2',1.5);
            return false;
        }
        var addr = $("#addrBox").val();
        var phone = $("#phoneBox").val();
        var phone2 = $("#phoneBox2").val();
        var truename = $("#truenameBox").val();
        $.post("{:U('Box/saveAddr')}",{
            id:id,
            phone:phone,
            phone2:phone2,
            addr:addr,
            truename:truename
        },function(data){
            if(id>0){
            $('#tr_'+id).children(".truename").text(truename);
            $('#tr_'+id).children(".phone").text(phone);
            $('#tr_'+id).children(".phone2").text(phone2);
            $('#tr_'+id).children(".addr").text(addr);
            }else{
                var tr = "<tr id='tr_"+data+"'>\n\
<td class='truename' width='90px'>"+truename+"</td>\n\
<td class='phone' width='90px'>"+phone+"</td>\n\
<td class='phone2' width='90px'>"+phone2+"</td>\n\
<td class='addr'>"+addr+"</td>\n\
<td width='145px'>\n\
<a class='to_default' onclick=setAddr($(this),'"+data+"') href='javascript:;'>设为默认</a>\n\
<a class='default' style='display:none' href='javascript:;'>默认信息</a>\n\
<a class='change' onclick=editAddr($(this),"+data+") href='javascript:;'>修改</a>\n\
<a id='del_4' class='del' onclick='confirmBox($(this),'确定要删除该地址吗')' data-func=delAddr($('#del_"+data+"'),"+data+") href='javascript:;'>删除</a>\n\
</td></tr>";
        $('#tbDeliveryInfo').prepend(tr);
            }
            closebgbox('#mainbox')
        })
       
    }
    
</script>
<style>
    .table td{padding:12px 0 8px}
</style>
<div class='browsebox' id='browsebox' style='width:385px;'>
    <div class='head' id='headbox'>
        <a class='close' onclick="closebgbox('#mainbox')"></a>
        <span id='title'>送达地址</span>
    </div>
    <div class='boxcontent' style='padding:20px 0 30px'>
        <div class='select_address' id='select_address'>

            <form id="form" name="form">
                <table class="table" style="margin:0 auto">
                    <tr>
                        <td width="70px;" align="left"><span class="red" style="font-weight:600">*</span> 姓名：</td>
                        <td><input  type="text" id="truenameBox" style="width:160px;"name="truename" value="{$truename}" maxlength="5"/></td>
                        <td align="left"></td>
                    </tr>
                    <tr>
                        <td width="70px;"align="left"><span class="red" style="font-weight:600">*</span> 手机：</td>
                        <td><input  type="text" id="phoneBox" style="width:160px;" name="phone" value="{$phone}" maxlength="11"></td>
                        <td align="left"></td>
                    </tr>
                    <tr>
                        <td width="70px;"align="left">备选手机：</td>
                        <td><input  type="text" id="phoneBox2" style="width:160px;" name="phone2" value="{$phone2}" maxlength="11"></td>
                        <td align="left"></td>
                    </tr>
                    <tr>
                        <td width="70px;"align="left"><span class="red" style="font-weight:600">*</span> 地址：</td>
                        <td width="120px"align="left"><input  type="text" id="addrBox" name="addr"style="width:160px;" value="{$addr}" maxlength="50"/></td>
                        <td></td>
                    </tr>
                </table>

                <p class='mt_20'>
                    <input type="submit" class="orange_btn" value="保存">
                    <a href='javascript:;' class='cancel_btn' id='address_cancel' onclick="closebgbox('#mainbox')">取消</a>
                </p>
            </form>
            <!--            onclick="saveAddr('{$id}')"-->
        </div>
        <div class='clear'></div>
    </div>

</div>